import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:gold/base/provider_scaffold.dart';
import 'package:gold/ui/my/invoice/invoice_viewmodel.dart';
import 'package:gold/utils/res.dart';
import 'package:gold/utils/xfg_color.dart';
import 'package:gold/utils/xfg_size.dart';
import 'package:gold/widgets/common_widgets.dart';
import 'package:gold/widgets/dotted_line.dart';
import 'package:gold/widgets/xfg_text.dart';

/// @description: 我的发票
/// @author tangzhentao
/// @created at 22:56 2024/12/14

class InvoicePage extends StatelessWidget {
  const InvoicePage({super.key});

  @override
  Widget build(BuildContext context) {
    return ProviderScaffold<InvoiceViewmodel>(
      model: InvoiceViewmodel(),
      appBar: (_) => xfgAppbar(title: '我的发票', backgroundColor: XfgColor.transparent),
      onInit: (data) => data.load(),
      toplessBuilder: (_, invoice) => Container(
        padding: EdgeInsets.fromLTRB(XfgSize().size10, XfgSize().size20, XfgSize().size10, XfgSize().size10),
        child: Builder(builder: (ctx) {
          final sortType = ctx.select<InvoiceViewmodel, SortType?>((k) => k.sortType);
          return Row(
            children: [
              _sortWidget('排序方式', 1, sortType, invoice),
              SizedBox(width: XfgSize().size10),
              _sortWidget('发票日期', 2, sortType, invoice),
            ],
          );
        }),
      ),
      builder: (ctx, invoice) => ListView.builder(
        itemCount: invoice.list.length,
        itemBuilder: (_, index) {
          final isLast = index == invoice.list.length - 1;
          return GestureDetector(
            child: Container(
              margin: EdgeInsets.fromLTRB(XfgSize().size10, 0, XfgSize().size10, isLast && XfgSize().bottomBarHeight != 0 ? XfgSize().bottomBarHeight:XfgSize().size10),
              padding: EdgeInsets.symmetric(horizontal: XfgSize().size12),
              height: XfgSize().size162,
              decoration: white6Decoration,
              child: Column(
                children: [
                  Container(
                    height: XfgSize().size50,
                    alignment: Alignment.centerLeft,
                    child: XfgText('四川金峰科技有限公司', fontSize: XfgSize().text16, color: XfgColor.text1D),
                  ),
                  Padding(
                    padding: EdgeInsets.symmetric(horizontal: XfgSize().size3),
                    child: const DottedLine(),
                  ),
                  _infoItemWidget('购方名称', '个人', XfgSize().size14),
                  _infoItemWidget('发票金额', '¥196:00', XfgSize().size18),
                  _infoItemWidget('开票日期', '2024-05-12', XfgSize().size18)
                ],
              ),
            ),
          );
        },
      ),
    );
  }

  /// 排序的布局
  Widget _sortWidget(String text, int type, SortType? sort, InvoiceViewmodel invoice) => GestureDetector(
    onTap: () {
      if (sort?.type == type) {
        if (sort?.asc == 'desc') {
          invoice.sortType = SortType(type, 'asc');
        } else {
          invoice.sortType = SortType(type, 'desc');
        }
      } else {
        invoice.sortType = SortType(type, 'desc');
      }
    },
    child: Container(
      width: XfgSize().size100,
      height: XfgSize().size33,
      decoration: BoxDecoration(
        color: XfgColor.white,
        border: sort?.type == type ? Border.all(color: XfgColor.theme, width: XfgSize().size0_5):null,
        borderRadius: BorderRadius.circular(XfgSize().size33)
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          XfgText(text, fontSize: XfgSize().text14, color: sort?.type == type ? XfgColor.text1D:XfgColor.text2),
          SizedBox(width: XfgSize().size6),
          Image.asset(sort?.asc == 'asc' && sort?.type == type ? Res.imagesArrowUp:Res.imagesArrowDown, width: XfgSize().size14, height: XfgSize().size18, color: sort?.type == type ? XfgColor.text1D:null)
        ],
      ),
    ),
  );

  /// 信息通用布局
  Widget _infoItemWidget(String text, String value, double top) => Container(
    margin: EdgeInsets.only(top: top),
    child: Row(
      children: [
        XfgText(text, fontSize: XfgSize().text14, color: XfgColor.text3),
        Expanded(child: XfgText(value, fontSize: XfgSize().text14, color: XfgColor.text1D, textAlign: TextAlign.end))
      ],
    ),
  );
}
